import { Component } from 'react';
import React from 'react';
import { connect } from 'umi';
import APIS from '@/apis';
import { Select } from 'antd';
import HighPerformCardListAsset from '@/components/HighPerformCardListAsset';

class AssetManagerPage extends Component<any, any> {
  actionRef: any;
  state = {
    assetType: 1,
    renderTable: true,
  }
  requestGetData(
    current: number,
    pageSize: number
  ) {
    return APIS.AssetAPI.GetAssetList({ current, pageSize }, this.state.assetType)
  }


  handleDelete(data: any) {
    return APIS.AssetAPI.DeleteAsset(data)
      .then(() => {
        return Promise.resolve(true);
      })
      .catch(() => {
        return Promise.resolve(false);
      });
  }

  render() {
    return (
      <div>
        {/* <KeywordFilterSearch
          filters={[
            {
              title: '资源类型',
              multiple: false,
              keywords: ['全部', '图片', '视频', '音频', '动画', '3D模型'],
            },
            { title: '资源状态', multiple: false, keywords: ['全部', '审核通过', '审核未通过'] },
          ]}
        ></KeywordFilterSearch> */}
        <div style={{ display: 'inline-block', marginLeft: '20px' }}>资源类型：</div>
        <Select
          style={{ width: '100px', marginTop: '20px' }}
          defaultValue={1}
          onChange={v => {
            this.state.assetType = v
            this.setState({ renderTable: false })
            setTimeout(() => {
              this.setState({ renderTable: true })
            }, 1)
          }}
        >
          <Select.Option value={1}>图片</Select.Option>
          <Select.Option value={2}>视频</Select.Option>
          <Select.Option value={3}>文档</Select.Option>
          <Select.Option value={4}>其他</Select.Option>
        </Select>
        {
          this.state.renderTable &&
          <HighPerformCardListAsset
            ref={(ref) => this.actionRef = ref}
            requestGetData={this.requestGetData.bind(this)}
            profileType={this.state.assetType - 1}
            dataIndexes={{ image: 'url', title: 'url' }}
            handleDelete={this.handleDelete.bind(this)}
          />
        }
      </div>
    );
  }
}

export default connect()(AssetManagerPage);
